
//1.创建舞台、场景
	var canvas = document.getElementById('canvas');
    var stage = new JTopo.Stage(canvas); // 创建一个舞台对象
    var scene = new JTopo.Scene(stage); // 创建一个场景对象

 //2.新建配置结点
    var node1 = new JTopo.Node("node1");    // 创建一个节点
    var node2 = new JTopo.Node("node2");    // 创建一个节点
    var centerX = 350;
    var centerY = 250;
    node1.setLocation(300,200);    // 设置节点坐标
    node2.setLocation(350,250);    // 设置节点坐标

    //3.添加到场景中
    // scene.add(node1);
    // scene.add(node2);
    //
    // scene.add(newLink(node1,node2,"link",3));



var timeList = [];

var centerX = 400;
var centerY = 320;
var centerNode =  new JTopo.Node("center");
centerNode.setSize(10,10);
centerNode.setCenterLocation(centerX,centerY);
centerNode.dragable = false;
scene.add(centerNode);
function createRoundNode(nodeNum,center,radius){
    for(var i=nodeNum;i>=1;i--){
        var node = new JTopo.Node(i);
        var perDeg = parseFloat(360/nodeNum);
        var deg = (-2*Math.PI / 360) * perDeg * ((i+6)%12);
        var x = centerX + Math.sin(deg) * radius;
        var y = centerY + Math.cos(deg) * radius;
        node.setCenterLocation(x,y);
        timeList.push({x:x,y:y});
        // node.set
        node.textPosition = "Middle_Center";
        node.percent = 0.8;
        node.beginDegree = 0;
        node.editAble=true;
        node.setSize(20,20);
        node.dragable = false;

        // node.alpha=0.2;
        node.paint = function(g){
            g.save();
            g.beginPath();
            g.fillStyle = 'rgba(0,0,255,' + this.alpha + ')';
            g.moveTo(0,0);
            g.arc(0, 0,15, this.beginDegree, this.beginDegree + 2*Math.PI);
            g.fill();
            g.closePath();
            g.restore();
            this.paintText(g);
        };
        node.width = node.height = 30;
        scene.add(node);
        setTimeout("",1000,"");

    }
}
var count =0;

function keyListener1(event){
    //37~40 shan
    //     alert(event.keyCode);
    var keyCode = event.keyCode;
        switch (keyCode){
            case 37:
                eventHandler.moveLeft();
                break;
            case 38:
                eventHandler.moveUp();
                break;
            case 39:
                eventHandler.moveRight();
                break;
            case 40:
                eventHandler.moveDown();
                break;
        }
}



function clockFn(){
    count++;
    var index = count%12;
    var temp = parseInt(count/12);
    var color1 = "255,255,255";
    var color2 = "0,0,0";
    var node = scene.getElementByXY(timeList[index].x,timeList[index].y);
    scene.remove(node);
    if(temp%2!=0){
        node.fontColor =color1;
    }else{
        node.fontColor =color2;
    }
    if(node.inLinks!=null){
        // node.isLinks = null;
        scene.add(node);
    }else{
        scene.add(node);
        // scene.add(newLink(centerNode,node,"",3));
    }



}
// setInterval(clockFn,5000);

// JTopo.Effect.Animate.stepByStep()
createRoundNode(12,centerNode,140);




function createToolbar(){
    createNode();

}


var minRadius = 90;
var hourRadius = 80;
var secRadius = 110;
var secondNode = null;
var minuteNode = null;
var hourNode = null;

function initSMHNode(secX,secY,minX,minY,hourX,hourY){
    if(!secondNode || !minuteNode || !hourNode){
         secondNode = new JTopo.Node("");
         minuteNode = new JTopo.Node("");
         hourNode = new JTopo.Node("");
        minuteNode.setSize(1,1);
        secondNode.setSize(1,1);
        hourNode.setSize(1,1);
        minuteNode.alpha=0;
        secondNode.alpha=0;
        hourNode.alpha=0;
        scene.add(secondNode);
        scene.add(minuteNode);
        scene.add(hourNode);
        var secondLink = newLink(centerNode,secondNode,"");
        var minuteLink = newLink(centerNode,minuteNode,"");
        var hourLink = newLink(centerNode,hourNode,"");
        secondLink.arrowsRadius = 5;
        minuteLink.arrowsRadius = 5;
        hourLink.arrowsRadius = 5;
        scene.add(secondLink);
        scene.add(minuteLink);
        scene.add(hourLink);
    }
    secondNode.setCenterLocation(secX,secY);
    minuteNode.setCenterLocation(minX,minY);
    hourNode.setCenterLocation(hourX,hourY);
}



var perDegSec = parseFloat(360/60);
function secondMove(){
    var timeObj = intiTime();
    var secondCnt = timeObj.s;
    var minCnt = timeObj.m;
    var hour = timeObj.h;
    centerNode.text = appendZero(hour)+":"+ appendZero(minCnt)+":"+ appendZero(secondCnt);
    var hourCnt =(timeObj.h)%12;
    var secDeg = (-2*Math.PI / 360) * perDegSec * (secondCnt)+Math.PI;
    var minDeg = (-2*Math.PI / 360) * perDegSec * (minCnt)+Math.PI;
    var hourDeg = (-2*Math.PI / 360) * perDegSec * ((hourCnt+parseFloat(minCnt/60))*5)+Math.PI;
    var secX = centerX + Math.sin(secDeg) * secRadius;
    var secY = centerY + Math.cos(secDeg) * secRadius;
    var minX = centerX + Math.sin(minDeg) * minRadius;
    var minY = centerY + Math.cos(minDeg) * minRadius;
    var hourX = centerX + Math.sin(hourDeg) * hourRadius;
    var hourY = centerY + Math.cos(hourDeg) * hourRadius;
    initSMHNode(secX,secY,minX,minY,hourX,hourY);
}
setInterval(secondMove,1000);



linkEach();
function linkEach(){
    for(var i=0;i<timeList.length;i++){
        var node1 = scene.getElementByXY(timeList[i].x,timeList[i].y);
        var node2 = scene.getElementByXY(timeList[(i+1)%12].x,timeList[(i+1)%12].y);
        // var curveLink =  new JTopo.CurveLink(node1, node2, text);
        scene.add(newLink(node1,node2,"",5));
    }
}


function appendZero(num){
    return num>9?num:("0"+num);
}


//创建node
function createNode(text,x,y){
    var node1 = new JTopo.Node(text);
    node1.setLocation(x,y);
    return node1;
}

function newLink(nodeA, nodeZ, text, dashedPattern){
    var link = new JTopo.Link(nodeA, nodeZ, text);
    link.lineWidth = 3; // 线宽
    link.dashedPattern = dashedPattern; // 虚线
    link.bundleOffset = 60; // 折线拐角处的长度
    link.bundleGap = 20; // 线条之间的间隔
    link.textOffsetY = 3; // 文本偏移量（向下3个像素）
    link.strokeColor = '0,200,255';
    scene.add(link);
    return link;
}


function intiTime(){
    var date = new Date();
    var seconds = date.getSeconds();
    var hours = date.getHours();
    var minutes = date.getMinutes();
    return {m:minutes,h:hours,s:seconds};
}


var nodeMethod = function () {
    return {

    };
}();


var eventHandler = function(){
    return {
        addNode:function(obj){
            var $node = obj;
            var newNode = createNode("node",100,100);
            newNode.editAble=true;
        },

        moveLeft:function () {
            var x = centerNode.x;
            var y = centerNode.y;
            centerNode.setLocation(x-5,y);
        },
        moveRight:function () {
            var x = centerNode.x;
            var y = centerNode.y;
            centerNode.setLocation(x+5,y);
        },
        moveUp:function () {
            var x = centerNode.x;
            var y = centerNode.y;
            centerNode.setLocation(x,y-5);
        },
        moveDown:function () {
            var x = centerNode.x;
            var y = centerNode.y;
            centerNode.setLocation(x,y+5);
        },
    };
}();

